﻿@import '_variables.less';
@import '_mixins.less';
@import "_common.less";
@import "_nav.less";
@import "_pagination.less";


html,body{
    margin:0;padding:0;height:100%;
}
body {
    position:relative;
    font-family:@font-family-base;.font-size(1.4);color:@color_text;
    background-color:#fff;
}

a{
    color:@linkColor;text-decoration:none;
    &:hover{
        color:@color_hover;text-decoration:none;
    }
}


.bbi-page-header {
    height: 70px;
    border-bottom: 1px #eff5f5 solid;
}
.page-contact {
    background: #5f5f5f url(../img/bg_contact.jpg) no-repeat center bottom;
    height: 795px;
    background-size: cover;

    .container {
        position: relative;height:100%;
    }

    .contactbox {
        position: absolute;
        bottom: 0;
        left: 15px;
        width: 524px;
        z-index: 100;

        .title {
            font-size: 80px;
            color: #fff;
            font-weight: normal;
            line-height: 1;
            margin: 15px 0;
            text-shadow: 0px 0px 10px rgba(4, 0, 0, 0.32);
        }

        aside {
            background-color: #fff;
            padding:40px 45px;
            h3{
                font-size:26px;font-weight:normal; text-transform:uppercase;margin:0 0 15px;
            }
            ul{
                .mplnone;
                li{
                    padding:6px 0 6px 30px;position:relative;
                    i.iconfont{
                        font-size:20px;position:absolute;top:3px;left:0;z-index:100;
                    }
                }
            }
        }
    }
}


.page-about {
    background: #fff url(../img/bg_about.jpg) no-repeat;
    background-position: center top;
    background-repeat: no-repeat;
    padding-bottom: 50px;

    .container {
        position: relative;
        padding-top: 900px;

        .logo {
            position: absolute;
            left: 25%;
            top: 60px;
            z-index: 100;
        }

        .text {
            position: absolute;
            left: 29%;
            top: 220px;
            z-index: 100;
        }

        .textcn {
            position: absolute;
            left: 29%;
            top: 550px;
            z-index: 100;
        }

        .product {
            position: absolute;
            right: -100px;
            top: 260px;
            z-index: 100;
        }

        .photo {
            padding-top: 80px;
            text-align: right;

            img {
                max-width: 100%;
            }
        }

        .content {
            color: @color_main;

            .title {
                font-size: 72px;
                font-weight: normal;
                margin: 0;
            }

            p {
                line-height: 2;
            }
        }
    }
}

.sitepath {
    color: #999;padding-top:25px;padding-bottom:25px;

    a {
        color: #999;
    }

    .breadcrumb{
        .mplnone;
        li{
            display:inline-block;
        }
    }
}



.page-news {
    margin-bottom: 50px;

    .item {
        position: relative;
        display: block;
        margin-bottom: 50px;

        .thumbnail {
            margin-bottom: 15px;

            img {
                width: 100%;
            }
        }

        .des {
            h3 {
                margin: 0 0 15px;
                padding: 0;
                font-size: 20px;
                text-transform: uppercase;
                color: #333;
            }

            p {
                color: #999;
            }

            .meta {
                color: #999;
            }
        }
    }

    .article {
        h2.title {
            color: #333;
            font-size: 32px;
            margin: 0 0 15px;
        }

        .content {
            margin-bottom: 40px;
            line-height: 1.8;
        }
    }

    .note {
        margin-bottom: 15px;
        position: relative;
        margin-bottom: 20px;

        ul {
            .mplnone;

            li {
                display: inline-block;
                color: #999;
                font-size: 12px;
                padding: 0 8px;
                border-left: 1px #ddd solid;

                &:first-child {
                    border: none;
                    padding-left: 0;
                }
            }
        }

        &:after {
            content: ' ';
            display: block;
            width: 30px;
            height: 2px;
            background-color: #ddd;
            position: absolute;
            left: 0;
            top: 25px;
        }
    }
}

.page-login {
    margin-bottom: 50px;

    .loginform {
        margin:50px auto;

       width:30%;
    }
}
.page-register{
    .registerbox{
        margin:50px auto;width:30%;
    }
}



.page-products {
    margin-bottom: 40px;

    .productlist {
        border-top: 1px #f2f2f2 solid;
        border-left: 1px #f2f2f2 solid;

        .item {
            margin: 0 -15px;
            text-align: center;
            border-right: 1px #f2f2f2 solid;
            border-bottom: 1px #f2f2f2 solid;
            padding-top: 40px;

            a {
                display:block;
                img {
                    height: 400px;
                    margin-bottom: 15px;
                    transition:all 1s;
                }
                &:hover{
                   img{
                       transform:scale(1.1);
                   }
                }
            }


            h3 {
                padding: 15px 15px 30px;
                overflow: hidden;
                white-space: nowrap;
                text-overflow: ellipsis;
                margin: 0;
                font-weight: normal;
            }
        }
    }
}
.page-productdetail {

    .bx-wrapper {
        border: none;
        box-shadow: none;
        margin-bottom: 30px;
    }

    .title {
        color: @color_main;
        font-weight: normal;
        font-size: 20px;
        margin: 0 0 30px;
    }

    .thumb {
        border: #f2f2f2 1px solid;
        padding: 30px 25px;
        text-align: center;
    }

    .productdes {
       

        h2 {
            color: #333;
            margin: 0 0 20px;
            font-size: 40px;
            font-weight: lighter;
        }

        ul {
            .mplnone;

            li {
                padding: 8px 15px;
                color: #999;

                span {
                    color: #333;
                }

                &:nth-child(2n+1) {
                    background-color: #f2f2f2;
                }
            }
        }

        .content{
            img{
                max-width:100%;
            }
        }
    }
}
.list-series{
        margin:0 0 20px;padding:0;
        li{
            border-bottom:1px #ddd solid;padding-top:8px;padding-bottom:8px;margin:0;
            list-style-position:inside;
        }
    }
.list-products{
    .item-product{
        margin-bottom:15px;display:block;width:48%;float:left;
        img{
            width:100%;
        }
        figcaption{
            text-align:center;padding:8px;
        }
        &:nth-child(2n+1){
            float:right;
        }
    }
}

.gallery-top{
    margin-bottom:10px;height:653px;
    img{
        width:100%;
    }
}
.gallery-thumbs{
    background-color:#f7f7f7;height:100px;
    .swiper-slide{
        display:inline-block;width:100px;
        img{
            opacity:.5;
        }

        &.swiper-slide-active{
             img{
                opacity:1;
            }
        }
    }
}

.laster-news{
    margin-bottom:50px;
    .item-post{
        display:block;
        position:relative;padding-left:115px;
        img{
            position:absolute;left:0;width:100px;top:0;
        }
        p{
            color:#999;
        }
    }
}

.page-member{
    min-height:550px;
    .nav {
        padding-left: 380px;      
        a{
            i.iconfont{
                font-size:20px;margin-right:6px;
            }
        }
    }
}

.page-footer {
    background-color: #f3f3f3;
    padding: 15px 0;
    color: #b2b2b2;

    .logo {
        margin-bottom:5px;
    }

    p {
        margin: 0;
    }

    .contact {
        text-align: right;padding-top:30px;
    }
}
